<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--[if lt IE 9]>
    <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <meta name="format-detection" content="telephone=yes"/>
    <meta name="msapplication-tap-highlight" content="no" />
    <style>
       body{
           width: 100%;
           height: 20em;
       }
       h2{
           text-align: center;
       }
        #a{
            width: 25%;
            height: 100%;
            border: solid 2px green;
            float: left;
            margin: 2%;
        }
        .a1{
            width: 100%;
            height: 70%;
        }
        .carnum{
            font-size: 1.3em;
            text-align: center;

        }
        li{
            list-style: none;
            text-align: center;
            padding: 2%;
            margin-top: 2%;
        }
        a{
            padding: 2%;
            text-decoration: none;
            color: black;
            background-color: cadetblue;
        }
        a:hover{
            background-color: orange;
        }
        img{
            width: 100%;
            height: 100%;
        }
       @media screen and (min-width:1440px) and (max-width:1600px){}
       @media screen and (min-width:1440px){ /*大于等于1440*/
           /*这里是特定的样式表*/


           body,input,textarea,select,small,a{font-size:14px;}
       }
       @media screen and (max-width:1024px){
           /*懒人建站*/

       }
       @media screen and (max-width:768px){
           /*不大于768px的设备尺寸中 响应式布局的特定样式*/
       }
       @media screen and (max-width:360px){

       }
       @media screen and (max-width:320px){

       }

    </style>

</head>
<body>
<h2>汽车在线投票系统</h2>
<div id="a">
<div class="a1">
    <img src="img/m1.jpg"></div>
    <div class="carnum">票数</div>
    <li><a href="#">我要投票</a></li>

</div>
<div id="a">
    <div class="a1">
    <img src="img/m2.jpg"></div>
    <div class="carnum">票数</div>
    <li><a href="#">我要投票</a></li></div>

<div id="a">
    <div class="a1">
    <img src="img/m3.jpg"></div>
    <div class="carnum">票数</div>
    <li><a href="#">我要投票</a></li></div>

</body>
</html>